/*
 * Skin: Blue
 * ----------
 */
@import "../../bootstrap-less/mixins.less";
@import "../../bootstrap-less/variables.less";
@import "../variables.less";
@import "../mixins.less";

.skin-blue-light {
  //Navbar
  .main-header {
    .navbar {
      .navbar-variant(@light-blue; #fff);
      .sidebar-toggle {
        color: #fff;
        &:hover {
          background-color: darken(@light-blue, 0%);
        }
      }
      @media (max-width: @screen-header-collapse) {
        .dropdown-menu {
          li {
            &.divider {
              background-color: rgba(255, 255, 255, 0.1);
            }
            a {
              color: #fff;
              &:hover {
                background: darken(@light-blue, 5%);
              }
            }
          }
        }
      }
    }
    //Logo
    .logo {
      .logo-variant(darken(@light-blue, 0%));
    }

    li.user-header {
      background-color: #fff;
    }
  }
  .content-wrapper{
    background-color: #2e80ab;
  }
  //Content Header
  .content-header {
    background: transparent;
  }

  //Create the sidebar skin
  .skin-dark-sidebar(@light-blue);

  //Create the content skin
  .blue-box-content-color(@light-blue);

  //Create the rightsidebar skin
  .blue-right-sidebar-color(@light-blue);

  //Create the more skin
  .blue-more-color(@light-blue);

  //Create the histroy skin
  .blue-history-color(@blue);
}

.skin-blue-light.layout-top-nav .main-header > .logo {
  .logo-variant(@light-blue);
}
